.container {
  padding: 20px;
  background: #f0f2f5;
  min-height: 100vh;

  .resultCard {
    margin-top: 16px;
    margin-bottom: 16px;
  }

  :global {
    .ant-card {
      margin-bottom: 24px;
    }

    .ant-table-tbody > tr.ant-table-row:hover > td {
      background-color: #e6f7ff;
    }
  }

  .tableRow {
    transition: all 0.3s;
    
    &:hover {
      background-color: #e6f7ff;
    }
  }

  .analysisResult {
    padding: 16px;

    .scoreSection {
      text-align: center;
      margin-bottom: 24px;

      .scoreDisplay {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 16px;
        margin-top: 16px;

        .scoreCircle {
          width: 120px;
          height: 120px;
          border-radius: 60px;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: 36px;
          font-weight: bold;
          color: white;
          transition: all 0.3s;

          &.good {
            background: linear-gradient(135deg, #52c41a, #389e0d);
            box-shadow: 0 4px 12px rgba(82, 196, 26, 0.2);
          }

          &.warning {
            background: linear-gradient(135deg, #faad14, #d48806);
            box-shadow: 0 4px 12px rgba(250, 173, 20, 0.2);
          }

          &.bad {
            background: linear-gradient(135deg, #ff4d4f, #cf1322);
            box-shadow: 0 4px 12px rgba(255, 77, 79, 0.2);
          }
        }

        .scoreText {
          font-size: 16px;
        }
      }
    }

    .rulesSection {
      .ruleCard {
        margin-bottom: 16px;
        border-radius: 8px;
        transition: all 0.3s;

        &.positiveRule {
          background-color: #f6ffed;
          border-left: 4px solid #52c41a;

          &:hover {
            box-shadow: 0 2px 8px rgba(82, 196, 26, 0.1);
          }
        }

        &.negativeRule {
          background-color: #fff2f0;
          border-left: 4px solid #ff4d4f;

          &:hover {
            box-shadow: 0 2px 8px rgba(255, 77, 79, 0.1);
          }
        }

        .ruleHeader {
          display: flex;
          justify-content: space-between;
          align-items: center;
          margin-bottom: 8px;
        }

        .ruleContent {
          display: flex;
          flex-direction: column;
          gap: 8px;

          .anticon {
            margin-right: 8px;
          }
        }
      }
    }
  }
}

.resultCard {
  margin-top: 24px;
  
  pre {
    background: #f5f5f5;
    padding: 16px;
    border-radius: 4px;
    overflow: auto;
  }
} 